{include file="public/header"}
<div class="topimg">
    <img src="/static/index/img/top.png" alt="" class="fullimg">
    <a href="{:url('/apply/index', ['activity_id' => $activity.id])}" id="applyspan" class="animated tada">我要报名</a>
    <img src="/static/index/img/baby.png" alt="" class="baby">
</div>
<div class="logo">
    <img src="/static/index/img/logo.png" alt="">
</div>
<div class="main">
    <div class="databox">
        <div class="numbox">
            <div class="weui-flex">
                <div class="weui-flex__item">
                    <h2>{$statisticsTotal.participant}</h2>
                    <p>总参与者</p>
                </div>
                <div class="weui-flex__item">
                    <h2>{$statisticsTotal.voteTotal}</h2>
                    <p>总投票数</p>
                </div>
                <div class="weui-flex__item">
                    <h2>{$statisticsTotal.visitTotal}</h2>
                    <p>总访问量</p>
                </div>
            </div>
        </div>
        <div class="search">
            <label>搜索</label>
            <input type="text" name="keyword" value="{$keyword}">
        </div>
    </div>
    <div class="listbg">
        <div class="listbo">
            <div class="topbg">
                <div class="btngroup">
                    <a href="{:url('/index/index/index', ['activity' => $activity.id])}" class="weui-btn {eq name="sort" value="create_time"}sbtn{else /}gbtn{/eq}">最新参赛</a>
                    <a href="{:url('/index/index/index', ['activity' => $activity.id, 'sort' => 'poll'])}" class="weui-btn {eq name="sort" value="poll"}sbtn{else /}gbtn{/eq}">票数排序</a>
                </div>
            </div>
            <div class="listdiv" id="list">
                {foreach name="apply" item="val"}
                <div class="imgbox">
                    <div>
                        <a href="{:url('/index/index/detail', ['activity' => $activity.id, 'apply_id' => $val.id])}" class="media">
                            <img src="{$val.picture}" alt="" class="fullimg">
                            <span>NO.{$val->getRank()}</span>
                        </a>
                        <div class="weui-flex">
                            <div class="weui-flex__item num">{$val.number}</div>
                            <div class="weui-flex__item msg">
                                <h3 class="elip">{$val.baby_name}</h3>
                                <p class="c-red elip">{$val.poll}票</p>
                            </div>
                        </div>
                        {if condition="$val['record']"}
                        <div class="voice">
                            <button class="voicespan">参赛宣言<span class="f-right">50s</span></button>
                            <audio controls class="voiceaudio">
                                <source src="{$val['record']}" type="audio/mpeg">
                            </audio>
                        </div>
                        {/if}
                        <a href="javascript:;" class="weui-btn redbtn toupiao" data-id="{$val.id}">投一票</a>
                    </div>
                </div>
                {/foreach}
            </div>
        </div>
        <img src="/static/index/img/fobo.png" alt="" class="fobo">
    </div>
    <p class="fotspan">Copiright @2012-2018</p>
    <p class="fotspan">美育儿meiyuer.com 版权所有</p>



    <div class="fot infot">
        <img src="/static/index/img/fot.png" alt="" class="fullimg">
        <div>
            <a href="{:url('/apply/index', ['activity_id' => $activity.id])}" class="baomin">我要报名</a>
            <a href="{:url('/index/index/index', ['activity_id' => $activity.id])}">首页投票</a>
            <a href="{:url('/user/personal', ['activity_id' => $activity.id])}">个人中心</a>
        </div>
    </div>

    <div class="cover">
        <img src="/static/index/img/cover.png" alt="" class="fullimg">
        <i class="iconfont icon-guanbi closebtn2 coverbtn"></i>
    </div>

    <script src="https://apps.bdimg.com/libs/jquery/1.10.2/jquery.min.js"></script>
    <script type="text/javascript" src="/static/index/js/jquery-weui.min.js"></script>
    <script type="text/javascript" src="/static/index/js/layer.js"></script>
    <script type="text/javascript" src="/static/index/js/layer/layer.js"></script>
    <script type="text/javascript" src="/static/index/js/fastclick.js"></script>
    <script type="text/javascript" src="/static/index/js/common.js"></script>
    <script src="http://res.wx.qq.com/open/js/jweixin-1.2.0.js"></script>
    <script>
//        wx.config({
//            debug: false,
//            appId: signPackage.appId,
//            timestamp: signPackage.timestamp,
//            nonceStr: signPackage.nonceStr,
//            signature: signPackage.signature,
//            jsApiList: [
//                'onMenuShareAppMessage',
//                'onMenuShareTimeline'
//            ]
//        });
//        wx.ready(function () {
//            $('body').on('click', '.lapiao', function () {
//                alert(123);
//                if(apply == undefined || apply == null || apply == '') return false;
//                $('.cover').fadeIn();
//                var url = 'http://v.meiyuer.cn/index/detail/activity_id/'+ activity.id + '/apply_id/' + apply.id + '.html';
//                var img = 'http://v.meiyuer.cn' + apply.picture;
//                wx.onMenuShareAppMessage({
//                    title: activity.title, // 分享标题
//                    desc: apply.baby_name, // 分享描述
//                    link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
//                    imgUrl: img, // 分享图标
//                    type: '', // 分享类型,music、video或link，不填默认为link
//                    dataUrl: '', // 如果type是music或video，则要提供数据链接，默认为空
//                    success: function () {
//                        shareSuccess();
//                    }
//                });
//
//                wx.onMenuShareTimeline({
//                    title: activity.title, // 分享标题
//                    link: url, // 分享链接，该链接域名或路径必须与当前页面对应的公众号JS安全域名一致
//                    imgUrl: img, // 分享图标
//                    success: function () {
//                        // 用户确认分享后执行的回调函数
//                        shareSuccess();
//                    },
//                });
//            });
//        });

        // 弹窗
        var ad = {$ad|json_encode};
        if(ad != null && ad != '' && ad != undefined) {
            var adHtml = '<div class="popmodal" id="festivalpop">' +
                '<div class="festival"><img src="'+ ad.ad +'" alt="" class="fullimg">';
            if(ad.content != '') {
                adHtml += '<p>'+ ad.content +'</p>';
            }
            adHtml += '</div></div>'
            layer2.open({
                type: 1,
                shadeClose: true,
                content:adHtml,
                btn:'<i class="iconfont icon-guanbi closebtn2"></i>',
            });
        }

        var vleng = $('.voicespan .f-right');
        var aud = $('.voiceaudio');

        for(var i=0;i<vleng.length;i++){
            voiceleng(i);
        }

//        function voiceleng(i){
//            var aud2 = aud.eq(i);
//            var aud3 = aud2[0];
//            setTimeout(function (){
//                var leng = parseInt(aud3.duration);
//                vleng.eq(i).text(leng+'s');
//            },1000);
//        };

        function voiceleng(i) {
            var aud2 = aud.eq(i);
            var aud3 = aud2[0];
            setTimeout(function () {
                var duration = aud3.duration;
                if(isNaN(duration)){
                    voiceleng(i);
                } else {
                    vleng.eq(i).text(parseInt(duration)+'s');
                }
            }, 500);
        }



        $('body').on('click','.voicespan',function(){
            var audio = $(this).siblings('.voiceaudio');
            var player = audio[0];
            if (player.paused){
                player.play();
            }else {
                player.pause();
            }
        })

        //元旦弹窗
        // layer.open({
        //     type: 1,
        //     shadeClose: true,
        //     content:'<div class="popmodal" id="festivalpop"><div class="festival"><img src="/static/index/img/fes2.png" alt="" class="fullimg"></div></div>',
        //     btn:'<i class="iconfont icon-guanbi closebtn2"></i>',
        // });

        //下拉加载
        // var loading = false;  //状态标记
        // $(document.body).infinite().on("infinite", function() {
        //     if(loading) return;
        //     loading = true;
        //     var html = '<div class="imgbox"><div><a href="details.html" class="media"><img src="/static/index/img/b1.png" alt="" class="fullimg"><span>NO.0021</span></a><div class="weui-flex"><div class="weui-flex__item num">001</div><div class="weui-flex__item msg"><h3 class="elip">豌豆射手</h3><p class="c-red elip">168888票</p></div></div><div class="voice">参赛宣言<span class="f-right">50s</span></div><a href="javascript:;" class="weui-btn redbtn toupiao">投一票</a></div></div>'
        //     setTimeout(function() {
        //         $("#list").append(html);
        //         loading = false;
        //     }, 1000);   //模拟延迟
        // });



        $('.search label').click(function() {
            var keyword = $(this).next('input[name=keyword]').val();
            var url = '/index/index/activity_id/' + activity.id;
            if(keyword != '') url += '/keyword/' + keyword;
            url += '.html';
            window.location.href = url;
        });

    </script>
{include file="public/footer"}
